<template>
  <el-select :value="value" :placeholder="placeholder" @change="staSelect" :disabled="disabled">
    <el-option v-for="item in options" :key="item.id" :label="item.staName" :value="item.id"></el-option>
  </el-select>
</template>

<script>
import { listStationApi } from "@/api/station";
export default {
  props: {
    value: {
      type: Number,
      default: undefined,
    },
    placeholder: {
      type: String,
      default: "请选择岗位",
    },
    disabled: {
      type: Boolean,
      default: false,
    },
  },
  name: "",
  data() {
    return {
      options: [],
      queryInfo: {
        pageNum: 1,
        pageSize: 1000,
        staName: "",
      },
    };
  },
  created() {
    this.getStationList();
  },
  methods: {
    async getStationList() {
      const { code, data } = await listStationApi(this.queryInfo);
      if (code !== 200) return;
      this.options = data.stations;
    },
    staSelect(value) {
      this.$emit("update:value", value);
    },
  },
};
</script>

<style scoped lang="scss">
</style>
